<template>
  <div class="basic_info">
    <div class="info_operation_btn">
      <div class="btn_left">
        <el-button :type="newBtnStatus ? 'primary' : ''" @click="onNewOrder">新单(N)</el-button>
        <el-button
          v-if="buttonsPermissions.LuRu"
          :disabled="saveBtnStatus"
          :class="saveBtnStatus ? 'disabled_button' : ''"
          :type="orderStatus == 66 ? 'primary' : ''"
          @click="onSubmit"
          accesskey="s"
          >保存(S)</el-button
        >
        <el-button v-else class="disabled_button" disabled>保存(S)</el-button>
        <el-button
          v-if="buttonsPermissions.ShenHe"
          :disabled="auditBtnStatus"
          :class="auditBtnStatus ? 'disabled_button' : ''"
          :type="orderStatus == 0 ? 'primary' : ''"
          @click="onToExamine"
          accesskey="a"
          >审核(A)</el-button
        >
        <el-button v-else class="disabled_button" disabled>审核(A)</el-button>
        <el-select v-model="operationValue" @change="operationSelect(operationValue)">
          <el-option
            style="font-size: 12px"
            v-for="item in operationData"
            :key="item.value"
            :label="item.label"
            :value="item.value"
            :disabled="item.disabled"
            :style="item.disabled ? 'pointer-events: none' : ''"
          ></el-option>
        </el-select>
        <!-- <el-select v-model="importValue" @change="exportExcel(importValue)">
          <el-option
            style="font-size: 12px"
            v-for="item in importOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
            :disabled="orderStatus == 66 || orderStatus == 0"
            :style="orderStatus == 66 && orderStatus == 0 ? 'pointer-events: none' : ''"
          ></el-option>
        </el-select>-->
        <el-button
          v-if="buttonsPermissions.DaYin"
          :disabled="orderStatus == 66"
          :class="orderStatus == 66 ? 'disabled_button' : ''"
          @click="handleShortcutKeyPrint"
          >打印(P)</el-button
        >
        <el-button v-else class="disabled_button" disabled>打印(P)</el-button>
        <el-button @click="onShare" v-if="buttonsPermissions.FenXiang">分享</el-button>
        <el-button v-else class="disabled_button" disabled>分享</el-button>
        <!-- 审核状态 -->
        <img v-if="orderStatus == 5" style="width: 50px; height: 38px; margin-right: 10px" src="@/assets/shenhe.png" />
        <img
          v-else-if="orderStatus == 10"
          style="width: 57px; height: 43px; margin-right: 10px"
          src="@/assets/zuofei.png"
        />
        <img
          v-else-if="orderStatus == 20"
          style="width: 57px; height: 24px; margin-right: 10px"
          src="@/assets/hongchong.png"
        />
        <span v-else style="color: #1993fb; margin-right: 10px">{{ getOrderStatusText(orderStatus) || '未保存' }}</span>
        <!-- <div style="color: #1993fb">{{ getOrderStatusText(orderStatus) }}</div> -->
      </div>
      <div class="btn_right">
        <el-tooltip effect="dark" content="上一条" :enterable="false" placement="top">
          <el-button @click="onUpper" class="arrow_btn" icon="el-icon-arrow-left"></el-button>
        </el-tooltip>
        <el-tooltip effect="dark" content="下一条" :enterable="false" placement="top">
          <el-button @click="onLower" class="arrow_btn" icon="el-icon-arrow-right"></el-button>
        </el-tooltip>
        <div class="search_order">
          <div style="width: 70px">单据编号：</div>
          <el-input disabled v-model="queryData.orderNumber"></el-input>
        </div>
        <div class="bill_mask_back_view">
          <div v-if="maskViewStatus" class="bill_mask_view"></div>
          <el-checkbox :disabled="!isSupplementOrder" v-model="queryData.isReplacementOrder" @change="supplementChange"
            >补单</el-checkbox
          >
        </div>
      </div>
    </div>
    <div class="info_content_div">
      <div class="div_table">
        <div class="div_screen bill_mask_back_view">
          <div v-if="maskViewStatus" class="bill_mask_view"></div>
          <div class="screen_left">
            <div class="line_dialog">
              <p>客&nbsp;&nbsp;户</p>
              <span>*</span>
              <p class="dialog_input">
                <el-tooltip
                  :disabled="xghCompany.length <= 6"
                  effect="dark"
                  :content="xghCompany"
                  :enterable="false"
                  placement="bottom-start"
                >
                  <el-select
                    v-model="queryData.xghCompanyId"
                    style="width: 100%"
                    filterable
                    ref="deptSelect"
                    @change="onSelectCompany"
                    @visible-change="(value) => handleFilterMethod('', 'companyName')"
                    :filter-method="(value) => handleFilterMethod(value, 'companyName')"
                    @keydown.native.enter="handleCompanyEnter"
                  >
                    <el-option
                      style="font-size: 12px"
                      v-for="item in gysOptions"
                      :key="item.id"
                      :label="item.companyName"
                      :value="item.id"
                      :disabled="item.status == '1'"
                    ></el-option>
                    <el-option v-if="companyAdd" value>
                      <div @click="onShowSupplierAdd" style="display: flex; justify-content: center">
                        <span> <i class="el-icon-plus"></i>新增 </span>
                      </div>
                    </el-option>
                  </el-select>
                </el-tooltip>
                <i @click="onShowSupplier" class="el-icon-more"></i>
              </p>
            </div>
            <div>
              <p>收款类型</p>
              <span>*</span>
              <j-dict-select-tag
                type="select"
                dictCode="collection_type"
                style="margin: 0 10px; flex: 1"
                v-model="queryData.settlementTypeId"
                @change="onSelectSklx"
              ></j-dict-select-tag>
              <!-- <el-select @change="onSelectSklx" placeholder v-model="queryData.settlementTypeId">
                <el-option
                  style="font-size: 12px"
                  v-for="item in sklxOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>-->
            </div>
            <div>
              <p>整单优惠</p>
              <input
                type="number"
                min="0.01"
                step="0.01"
                v-model="queryData.discountPrice"
                @input="discountPriceInput"
                @focusin="focusinSelect"
                @focusout="calcbalance"
                :disabled="khyfkState"
              />
            </div>
            <div>
              <p>经手人</p>
              <el-select
                placeholder
                v-model="queryData.sysUserId"
                @change="jsrChange"
                filterable
                clearable
                @visible-change="(value) => handleFilterMethod('', 'realname')"
                :filter-method="(value) => handleFilterMethod(value, 'realname')"
              >
                <el-option
                  style="font-size: 12px"
                  v-for="item in jsrOptions"
                  :key="item.id"
                  :label="item.realname"
                  :value="item.id"
                ></el-option>
              </el-select>
            </div>
            <!-- <div>
              <p>收款日期</p>
              <div class="date_picker_style">
                <p>{{ queryData.skrq }}</p>
                <el-date-picker v-model="skrqDate" type="date"> </el-date-picker>
                <i class="el-icon-date"></i>
              </div>
            </div>-->
            <div class="date_div">
              <p>收款日期</p>
              <div class="date_style">
                <el-date-picker
                  :disabled="queryData.isReplacementOrder ? false : true"
                  v-model="queryData.collectionTime"
                  type="date"
                  value-format="yyyy-MM-dd"
                ></el-date-picker>
              </div>
            </div>
          </div>
        </div>
        <div class="table_content">
          <div class="content_div1 bill_mask_back_view">
            <div v-if="maskViewStatus" class="bill_mask_view"></div>
            <div style="height: 15px"></div>
            <div class="table_Div1">
              <!-- :summary-method="getBankSummaries" 列表为空时报错 -->
              <el-table
                show-summary
                :summary-method="getBankSummaries"
                highlight-current-row
                :header-cell-style="{
                  color: '#666666',
                  textAlign: 'center',
                  height: '30px',
                  borderColor: '#dddddd',
                }"
                :data="paymentTableData"
                height="100%"
                style="width: 100%"
                @row-click="onClickTablePayment"
              >
                <el-table-column type="index" width="80" label="序号">
                  <template slot-scope="scope">
                    <div v-if="scope.row.xhState" class="index_p">{{ scope.$index + 1 }}</div>
                    <div v-else class="index_button">
                      <i @click.stop="addRowPayment(scope.$index)" class="el-icon-circle-plus-outline"></i>
                      <i @click="deleteRowPayment(scope.$index)" class="el-icon-remove-outline"></i>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column property="bankName" label="账户名称">
                  <template slot-scope="scope">
                    <div v-if="scope.row.xhState" class="index_p">{{ scope.row.bankName }}</div>
                    <div v-else class="index_select">
                      <el-select v-model="scope.row.bankName" @change="bankNameChange($event, scope.row)">
                        <el-option
                          v-for="item in zhmcOptions"
                          :key="item.bankName"
                          :label="item.bankName"
                          :value="item.bankName"
                        ></el-option>
                        <el-option v-if="permissionAccountAdd" value>
                          <div @click="onShowAccountAdd" style="display: flex; justify-content: center">
                            <span> <i class="el-icon-plus"></i>新增 </span>
                          </div>
                        </el-option>
                      </el-select>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column property="price" label="金额">
                  <template slot-scope="scope">
                    <div v-if="scope.row.xhState" class="index_p">{{ scope.row.price }}</div>
                    <div v-else class="index_input">
                      <input
                        :disabled="!scope.row.bankId || scope.row.bankId == '' ? true : false"
                        @focusin="focusinSelect"
                        @focusout="calcbalance"
                        onkeyup="value=value.replace(/[^\d.,-]/g,'')"
                        v-model="scope.row.price"
                        placeholder="请输入"
                        @input="inputMoney('price', scope.row)"
                      />
                    </div>
                  </template>
                </el-table-column>
                <el-table-column property="remark" label="备注">
                  <template slot-scope="scope">
                    <div v-if="scope.row.xhState" class="index_p">{{ scope.row.remark }}</div>
                    <div v-else class="index_input">
                      <input
                        :disabled="!scope.row.bankId || scope.row.bankId == '' ? true : false"
                        @focusin="focusinSelect"
                        type="text"
                        v-model="scope.row.remark"
                      />
                    </div>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
          <div class="content_div">
            <div class="table_title">
              <div>
                <div>核销应收明细</div>
                <div v-if="skjsState">预付款请输入负数，即可冲销应收应付款</div>
                <div v-if="khyfkState">预付款不能结销，不能操作核销明细</div>
                <div v-if="xstkState">退款请输入负数，即可冲销应收应付款</div>
              </div>
              <div v-if="!khyfkState">
                <span>可结算金额：</span>
                <span>¥{{ $formatMoney(queryData.balance) }}</span>
              </div>
              <div v-if="!khyfkState">
                <el-button :disabled="maskViewStatus" type="primary" plain @click="onCollectionCode" style="width: 80px"
                  >生成收款码</el-button
                >
                <el-button :disabled="maskViewStatus" @click="onAutomaticAllocation" style="width: 80px"
                  >自动分配</el-button
                >
                <el-tooltip
                  effect="dark"
                  content="删除后可通过刷新明细恢复初始数据"
                  :enterable="false"
                  placement="top-start"
                >
                  <el-button :disabled="maskViewStatus" @click="onDeleteTable" style="width: 80px"
                    >删除</el-button
                  >
                </el-tooltip>
                <el-button :disabled="maskViewStatus" type="primary" @click="onRefreshSub" style="width: 80px"
                  >刷新明细</el-button
                >
                <el-button @click="onViewReceivables" style="width: 80px">查看应收款</el-button>
                <i @click="onShowColumn" class="set_up el-icon-s-tools"></i>
              </div>
            </div>
            <div class="table_Div">
              <!-- <div v-if="maskViewStatus" class="bill_mask_view"></div> -->
              <el-table
                ref="tableRef"
                show-summary
                :summary-method="getSummaries"
                highlight-current-row
                :data="infoTableData"
                height="100%"
                style="width: 100%"
                :cell-style="setCellColor"
                :header-cell-style="setCellColor"
                @selection-change="handleSelectionChange"
              >
                <el-table-column type="selection" width="50"></el-table-column>
                <el-table-column type="index" width="50" label="序号" align="center"></el-table-column>
                <template v-for="(item, index) in columnData">
                  <el-table-column
                    :show-overflow-tooltip="true"
                    :key="index"
                    :label="item.zidingyiName ? item.zidingyiName : item.morenName"
                    v-if="item.zidingyiState"
                    :prop="item.props"
                    :min-width="item.props == 'settlementOrderNumber' ? '170px' : '130px'"
                    :sortable="item.sortable"
                    :width="item.cellWidth"
                  >
                    <template slot-scope="scope">
                      <div style="padding: 0 5px" v-if="scope.row.xhState || maskViewStatus">
                        {{ scope.row[item.props] }}
                      </div>
                      <div v-else class="index_input">
                        <input
                          v-if="item.props == 'thisPrice'"
                          @focusin="focusinSelect"
                          @focusout="focusoutThisPrice(scope.row)"
                          type="text"
                          v-model="scope.row[item.props]"
                          style="color: #1b94fb"
                          placeholder="请输入"
                          @input="inputMoney(item.props, scope.row)"
                        />
                        <input
                          v-else-if="item.props == 'remark'"
                          @focusin="focusinSelect"
                          type="text"
                          v-model="scope.row[item.props]"
                        />
                        <div
                          v-else-if="
                            item.props == 'allPrice' || item.props == 'offPrice' || item.props == 'surplusPrice'
                          "
                          style="padding: 0 5px"
                        >
                          {{ $formatMoney(scope.row[item.props]) }}
                        </div>
                        <div v-else style="padding: 0 5px">{{ scope.row[item.props] }}</div>
                      </div>
                    </template>
                  </el-table-column>
                </template>
              </el-table>
            </div>
          </div>
        </div>
        <div class="table_calculation">
          <div style="flex: 1" class="bill_mask_back_view">
            <div v-if="maskViewStatus" class="bill_mask_back_script"></div>
            <div :style="{ pointerEvents: maskViewStatus ? 'none' : '' }">
              <p>备注</p>
              <span>：</span>
              <el-input v-model="queryData.remark"></el-input>
            </div>
            <div>
              <p>附记</p>
              <span>：</span>
              <el-input v-model="queryData.postscript" @blur="updatePostScript()"></el-input>
            </div>
            <div>
              <p>制单人</p>
              <span>：</span>
              <span>{{ queryData.createName }}</span>
            </div>
            <div>
              <p>制单日期</p>
              <span>：</span>
              <span>{{ formatCreateOrderDate }}</span>
            </div>
          </div>
          <div style="width: 70px">
            <el-button plain @click="onShowLog">操作日志</el-button>
          </div>
        </div>
      </div>
    </div>
    <!-- 列配置弹框 -->
    <CConfiguration
      ref="setColumnRef"
      :columnDataArr="columnData"
      :defaultColumnDataArr="defaultColumnData"
      orderType="应收结算单"
      @onSaveColumn="onSaveColumn"
    ></CConfiguration>
    <!-- 选择客户弹框 -->
    <DialogSupplier ref="supplierRef" @onSelectSupplier="onSelectSupplier"></DialogSupplier>
    <!-- 新增客户弹框 -->
    <DialogSupplierAdd ref="supplierAddRef" @onAddSubmit="onAddSupplier"></DialogSupplierAdd>
    <dialogSimplePrompt ref="simplePrompt" @onSure="hongchongSure"></dialogSimplePrompt>
    <!-- 提醒弹框 -->
    <PopupReminder ref="reminderRef" :tipsData="tipsData" @onConfirm="onYes"></PopupReminder>
    <!-- 成功弹框 -->
    <PopupSuccess ref="successRef" :tipsData="tipsData" @onConfirm="onOptionSuccess"></PopupSuccess>
    <!-- 操作日志 -->
    <DialogOperationLog :logTitle="logTitle" ref="operationLogRef"></DialogOperationLog>
    <!-- 打印 -->
    <dialog-print ref="print"></dialog-print>
    <DialogAccountAdd ref="accountAdd" @onAddSubmit="accountCallback"></DialogAccountAdd>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import CConfiguration from '@/components/c_column/columnConfiguration1'
import DialogSupplier from '../../components/dialogSupplier'
import DialogSupplierAdd from '../../components/dialogSupplierAdd'
import PopupReminder from '../../components/popupReminder'
import PopupSuccess from '../../components/popupSuccess'
import dialogSimplePrompt from '../../components/dialogSimplePrompt'
import DialogOperationLog from '../../components/dialogOperationLog'
import DialogAccountAdd from '../../components/dialogAccountAdd'
/**打印 */
import dialogPrint from '../../components/dialogPrintSettlement.vue'
import { dateStrFromDate } from '@/utils/DateFormatter'
import { getAction, postAction, downPostFile } from '@/api/manage'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
// 导入调用处理权限数据方法
import {
  handlePermissions,
  handleOtherPerms,
  sysConfig,
  formatMoney,
  formatPrice,
  formatNumber,
  delcommafy,
  handleArrayToObject,
  handleObjectToArray,
  accSub,
  accAdd,
  handlePagePermissions,
} from '@/utils/index'
import { ACCESS_TOKEN, TENANT_ID, ACCOUNT_BOOK } from '@/store/mutation-types'
import Vue from 'vue'
export default {
  name: 'billCollectionSettlement',
  mixins: [JeecgListMixin],
  components: {
    CConfiguration,
    DialogSupplier,
    DialogSupplierAdd,
    PopupReminder,
    PopupSuccess,
    dialogSimplePrompt,
    DialogOperationLog,
    dialogPrint,
    DialogAccountAdd,
  },
  computed: {
    ...mapGetters(['isSupplementOrder']),
    //orderStatus 订单状态：新单66、0待审核、5审核通过、10作废、15反审、20红冲、25终止、30完成
    newBtnStatus() {
      return this.orderStatus == 5 || this.orderStatus == 10 || this.orderStatus == 20 || this.orderStatus == 30
    },
    saveBtnStatus() {
      return this.orderStatus == 5 || this.orderStatus == 10 || this.orderStatus == 20 || this.orderStatus == 30
    },
    auditBtnStatus() {
      return (
        this.orderStatus == 66 ||
        this.orderStatus == 5 ||
        this.orderStatus == 10 ||
        this.orderStatus == 20 ||
        this.orderStatus == 25 ||
        this.orderStatus == 30
      )
    },
    maskViewStatus() {
      return this.orderStatus != 66 && this.orderStatus != 0
    },
    formatCreateOrderDate() {
      let date = this.queryData.createOrderDate
      if (date.length > 10) {
        date = date.slice(0, 10)
      }
      return date
    },
    storeAdd() {
      return handlePermissions('仓库信息').LuRu
    },
    buttonsPermissions() {
      return handlePermissions('收款结算单')
    },
    companyAdd() {
      return handlePermissions('往来单位').LuRu
    },
    permissionAccountAdd() {
      return handlePermissions('账户信息').LuRu
    },
    supplementPermissions() {
      return handleOtherPerms('补录单据')
    },
    printPermissions() {
      return handleOtherPerms('单据可多次打印')
    },
    /**销售价格低于成本价预警 */
    isBelowCost() {
      return sysConfig().sell_below_cost_alarm
    },
    /**单据保存后立即开新单 */
    isSaveNewOrder() {
      return sysConfig().open_new_order_after_document_saved
    },
    /**单据保存后立即审核 */
    isSaveExamine() {
      return sysConfig().verify_order_after_document_saved
    },
    /**单据审核后立即开新单 */
    isExamineNewOrder() {
      return sysConfig().open_new_order_after_document_verify
    },
    // 2、启用价格跟踪
    PriceTracking() {
      return sysConfig().enable_price_tracking
    },
    // 3、启用折扣率跟踪
    discountTracking() {
      return sysConfig().enable_discount_tracking
    },
    // 保存时单价为0不提示
    isInputSkip() {
      return sysConfig().unit_price_zero_no_prompt
    },
    // thisPriceFormat(price) { return this.$formatMoney(price) }
  },
  created() {
    // console.log('收款结算单 created')
    // this.buttonsPermissions = handlePermissions('收款结算单')
    // this.companyAdd = handlePermissions('往来单位').LuRu
    let accountBook = Vue.ls.get(ACCOUNT_BOOK)
    this.accountBookId = accountBook && accountBook.id

    this.selectTitle()
    this.getData()

    if (!this.$route.params.billId) {
      //开新单
      this.onNewOrder()
    }
    // 获取价格、金额、数量小数点位数
    let unititem = this.$lcStorage.get('toFixedList')
    if (unititem) {
      this.moneyLength = unititem.allPrice
    }
    if (this.$route.params.xghCompanyId) {
      this.onSelectCompany(this.$route.params.xghCompanyId)
    }
  },
  watch: {
    'queryData.settlementTypeId': {
      deep: true,
      handler() {
        let val = this.queryData.settlementTypeId
        this.skjsState = false
        this.khyfkState = false
        this.xstkState = false
        if (val == '1') {
          this.skjsState = true
        } else if (val == '2') {
          this.khyfkState = true
        } else if (val == '3') {
          this.xstkState = true
        }
      },
    },
    'queryData.xghCompanyId': {
      deep: true,
      handler() {
        this.totalCompanys.forEach((item) => {
          if (item.id == this.queryData.xghCompanyId) {
            this.xghCompany = item.companyName
          }
        })
      },
    },
    'queryData.isReplacementOrder': {
      deep: true,
      handler() {
        let str = JSON.stringify(this.queryData)
        let arr = JSON.parse(str)
        this.requestQuery(arr)
      },
    },
    skrqDate(val) {
      this.queryData.collectionTime = dateStrFromDate(val)
    },
    orderStatus() {
      this.handleOperationData()
    },
    $route: {
      immediate: true,
      handler() {
        if (this.$route.name == 'paymentManage-paymentBill-billCollectionSettlement') {
          let source = this.$route.params.source
          let billId = this.$route.params.billId
          if (source == 'bill' || billId) {
            let bId = billId
            console.log('监听单据id变更： ', bId)
            if (bId && bId != this.billId) {
              this.billId = bId
              this.getOrderDetailById()
            }
          } else if (source == 'company') {
            let bId = this.$route.params.xghCompanyId
            if (bId) {
              let timeout = 0
              if (this.orderStatus != 0 && this.orderStatus != 66) {
                timeout = 300
                this.onNewOrder()
              }
              let that = this
              setTimeout(() => {
                this.queryData.xghCompanyId = bId
                this.queryData.settlementTypeId = '1'
                this.getCollectList()
              }, timeout)
            }
          } else {
            let bId = this.$route.params.billId
          }
        }
      },
    },
  },
  data() {
    return {
      // 传递给弹框的数据
      tipsData: {
        tipsWords: '',
        tipsMark: '',
      },
      // buttonsPermissions: {},
      // companyAdd: false, // 往来单位新增权限
      // 传递给操作日志的值
      logData: {
        orderId: -1,
        orderType: '收款结算单',
      },
      logTitle: '',
      operationValue: '操作',
      operationData: [],
      importValue: '导出',
      importOptions: [
        // {
        //   value: '导入',
        //   label: '导入',
        // },
        {
          value: '1',
          label: '导出',
        },
      ],
      // 客户
      gysOptions: [],
      // 收款类型
      sklxOptions: [
        {
          value: '1',
          label: '收款结算',
        },
        {
          value: '2',
          label: '客户预付款',
        },
        {
          value: '3',
          label: '销售退款',
        },
      ],
      // 经手人
      jsrOptions: [],
      // 账户名称
      zhmcOptions: [],
      // 暂存收款日期数据
      skrqDate: '',
      // 查询条件数据
      queryData: {
        orderNumber: '',
        balance: 0,
        isReplacementOrder: false,
        xghCompanyId: '',
        companyType: 2,
        settlementTypeId: '',
        discountPrice: '',
        sysUserId: '',
        collectionTime: '',
        remark: '',
        postscript: '',
        orderType: 14,
        createOrderDate: '',
        createName: '',
        price: formatMoney(0),
      },
      // 账户列表
      paymentTableData: [
        {
          xhState: false,
          bankId: '',
          bankName: '',
          price: '',
          remark: '',
        },
      ],
      collectionPayPage: {},
      // 核销应收明细表格数据
      infoTableData: [],
      // 当前点击行
      nowRow: 0,
      newColumnDataOut: [], //修改后的列数据
      newColumnDataIn: [],
      defaultColumnData: [],
      // 列配置数据
      columnData: [
        {
          id: '2',
          morenName: '应收发生日期',
          zidingyiName: '',
          morenState: true,
          cellWidth: '141px',
          zidingyiState: true,
          morenSort: 1,
          zidingyiSort: 1,
          noModify: false,
          props: 'startTime',
        },
        {
          id: '3',
          morenName: '应收款单号',
          zidingyiName: '',
          morenState: true,
          cellWidth: '182px',
          zidingyiState: true,
          morenSort: 2,
          zidingyiSort: 2,
          noModify: false,
          props: 'settlementOrderNumber',
        },
        {
          id: '4',
          morenName: '应收款类型',
          zidingyiName: '',
          morenState: true,
          cellWidth: '139px',
          zidingyiState: true,
          morenSort: 3,
          zidingyiSort: 3,
          noModify: false,
          props: 'type',
        },
        {
          id: '5',
          morenName: '经手人',
          zidingyiName: '',
          morenState: true,
          cellWidth: '139px',
          zidingyiState: true,
          morenSort: 4,
          zidingyiSort: 4,
          noModify: false,
          props: 'sysUserId_dictText',
        },
        {
          id: '6',
          morenName: '应收金额',
          zidingyiName: '',
          morenState: true,
          cellWidth: '139px',
          zidingyiState: true,
          morenSort: 5,
          zidingyiSort: 5,
          noModify: false,
          props: 'allPrice',
        },
        {
          id: '7',
          morenName: '当前已结销',
          zidingyiName: '',
          morenState: true,
          cellWidth: '139px',
          zidingyiState: true,
          morenSort: 6,
          zidingyiSort: 6,
          noModify: false,
          props: 'offPrice',
        },
        {
          id: '8',
          morenName: '当前剩余金额',
          zidingyiName: '',
          morenState: true,
          cellWidth: '139px',
          zidingyiState: true,
          morenSort: 7,
          zidingyiSort: 7,
          noModify: false,
          props: 'surplusPrice',
        },
        {
          id: '9',
          morenName: '本次收款金额',
          zidingyiName: '',
          morenState: true,
          cellWidth: '139px',
          zidingyiState: true,
          morenSort: 8,
          zidingyiSort: 8,
          noModify: true,
          props: 'thisPrice',
        },
        {
          id: '10',
          morenName: '备注',
          zidingyiName: '',
          morenState: true,
          cellWidth: '139px',
          zidingyiState: true,
          morenSort: 9,
          zidingyiSort: 9,
          noModify: true,
          props: 'remark',
        },
        {
          id: '11',
          morenName: '计划结算日期',
          zidingyiName: '',
          morenState: true,
          cellWidth: '139px',
          zidingyiState: true,
          morenSort: 10,
          zidingyiSort: 10,
          noModify: false,
          props: 'planDate',
        },
        {
          id: '12',
          morenName: '物流单号',
          zidingyiName: '',
          morenState: true,
          cellWidth: '139px',
          zidingyiState: true,
          morenSort: 11,
          zidingyiSort: 11,
          noModify: false,
          props: 'expressNumber',
        },
      ],
      pagesize: 20, //每页的数据条数
      currentPage: 1, //默认开始页面
      showLiepeizhi: false, //是否显示列配置
      skjsState: true, //收款结算状态
      khyfkState: false, //客户预付款状态
      xstkState: false, //销售退款状态

      selectTableData: [], // 选中的数据列表

      accountBookId: '', // 当前账套ID
      orderStatus: 0, // 当前单据的操作状态
      updateId: '', // 修改列配置时返回的id
      pageNo: 0, //
      pageTotal: 1,
      lowerLoading: false,
      upperLoading: false,

      orderFlag: 0, //先点上一单传1，先点下一单传2，点新单重置
      billId: '', // 结算单ID
      printData: {}, // 打印数据
      url: {
        listUrl: '/xghSettlementOrder/xghSettlementOrder/querySettlementOrderInfo', // 收款结算列表
        userList: '/dept/xghAccountBookDept/getAllDeptUsers', // 经手人列表
        api: '收款结算单',
        exportXlsUrl: '/xghSettlementOrder/xghSettlementOrder/exportSettlementOrderXls', //导出接口
      },

      xghCompany: '',
      saveData: '', // 预存保存后的数据
      moneyLength: 2,
    }
  },
  methods: {
    //查看单据详情
    getOrderDetailById() {
      getAction('/xghSettlementOrder/xghSettlementOrder/getById', { id: this.billId }).then((res) => {
        if (res.success) {
          this.handleData(res.result)
        } else {
          this.$elMessage.error(res.message)
        }
      })
    },
    supplementChange(val) {
      if (!val) {
        this.queryData.collectionTime = this.$formatDateTime()
      }
    },
    // 新增
    handleShortcutKeyAdd() {
      this.onNewOrder()
    },
    // 保存
    handleShortcutKeySave() {
      if (!this.buttonsPermissions.LuRu) {
        this.$elMessage.warning('未拥有保存权限！')
      } else if (this.saveBtnStatus) {
        this.$elMessage.warning('当前状态不支持保存操作！')
      } else {
        this.onSubmit()
      }
    },
    // 审核
    handleShortcutKeyExamine() {
      if (!this.buttonsPermissions.ShenHe) {
        this.$elMessage.warning('未拥有审核权限！')
      } else if (this.auditBtnStatus) {
        this.$elMessage.warning('当前状态不支持审核操作！')
      } else {
        this.onToExamine()
      }
    },
    // 打印
    handleShortcutKeyPrint() {
      if (!this.buttonsPermissions.DaYin) {
        this.$elMessage.warning('未拥有打印权限！')
      } else if (this.orderStatus == 66) {
        this.$elMessage.warning('当前状态不支持打印操作！')
      } else {
        console.log('快捷键打印-收款结算单')
        // 可以多次打印设置
        if (this.printPermissions) {
          this.$refs.print.show(this.printData, this.columnData, this.url.api)
        } else {
          if (this.$lcStorage.get('printLimitValue')) {
            // 获取打印次数
            this.getPrintNum(this.billId, () => {
              this.$refs.print.show(this.printData, this.columnData, this.url.api)
            })
          } else {
            this.$refs.print.show(this.printData, this.columnData, this.url.api)
          }
        }
      }
    },
    // 获取数据
    getData() {
      this.queryData.collectionTime = this.$formatDateTime()
      this.queryData.createOrderDate = this.$formatDateTime()
      this.queryData.createName = this.$lcStorage.get('xghUser').realname
      this.getUserList()
      this.getGysStorage()
      this.getBankList()
    },
    // 处理操作下拉列表的启用禁用项
    handleOperationData() {
      if (this.orderStatus == 66 || this.orderStatus == 0) {
        //   this.importValue = '导入'
        // } else {
        this.importValue = '导出'
      }
      //orderStatus 订单状态：0待审核、5审核通过、10作废、15反审、20红冲、25终止、30完成
      let allList = ['红冲', '作废']
      let result = []
      if (this.orderStatus == 66) {
        // 新单
        result = ['终止']
      } else if (this.orderStatus == 0 || this.orderStatus == 15) {
        // 保存/反审
        if (this.buttonsPermissions.ZuoFei) {
          result = ['作废', '终止']
        } else {
          result = ['终止']
        }
      } else if (this.orderStatus == 5) {
        // 审核后
        let list = []
        // if (this.buttonsPermissions.FanShen) {
        //   list.push('反审')
        // }
        if (this.buttonsPermissions.HongChong) {
          list.push('红冲')
        }
        result = list.concat(['终止', '完成'])
      } else if (this.orderStatus == 10 || this.orderStatus == 20) {
        // 作废/红冲
        result = []
      } else if (this.orderStatus == 30) {
        // 完成
        result = []
        if (this.buttonsPermissions.HongChong) {
          result = ['红冲']
        }
      } else if (this.orderStatus == 25) {
        // 终止
        result = []
        if (this.buttonsPermissions.ZuoFei) {
          result = ['作废']
        }
      }
      // 判断执行状态
      // 执行状态 0未完成 1已完成 2已终止
      if (this.queryData.performState == 2) {
        //终止
        result = []
        if (this.buttonsPermissions.ZuoFei) {
          result = ['作废']
        }
      } else if (this.queryData.performState == 1) {
        result = []
        if (this.buttonsPermissions.HongChong) {
          result = ['红冲']
        }
      }
      let resultList = []
      allList.forEach((item) => {
        let newItem = {
          value: item,
          disabled: result.indexOf(item) == -1,
        }
        resultList.push(newItem)
      })
      this.operationData = resultList
    },
    /**
     *  应收单据查询
     */
    // 应收单据查询列表
    getCollectList() {
      if (!this.queryData.xghCompanyId) {
        return
      }
      let params = {
        companyType: 2,
        orderType: 14,
        xghCompanyId: this.queryData.xghCompanyId,
        settlementTypeId: this.queryData.settlementTypeId
      }
      postAction(this.url.listUrl, params).then((res) => {
        console.log('应收单据', res)
        if (res.code == 200) {
          this.infoTableData = res.result
          this.infoTableData.forEach((item) => {
            item.thisPrice = 0
            if (item.settlementOrderNumber) {
              item.type = this.getTextByOrderNumber(item.settlementOrderNumber)
            } else if (item.orderType == '17') {
              item.type = '期初应收'
            }
          })
        }
      })
    },
    getTextByOrderNumber(orderNumber) {
      let options = {
        xsckd: '销售应收款',
        xshhd: '销售退换货款',
        xsthd: '销售退货款',
        cgrkd: '采购应付款',
        cghhd: '采购退换货款',
        cgthd: '采购退货款',
        fkjsd: '采购预付款',
        skjsd: '客户预付款',
        yskzj: '调账(应收款增加)',
        yskjs: '调账(应收款减少)',
        yfkzj: '调账(应付款增加)',
        yfkjs: '调账(应付款减少)',
      }
      let keys = Object.keys(options)
      for (let index = 0; index < keys.length; index++) {
        const key = keys[index]
        if (orderNumber.indexOf(key) > -1) {
          return options[key]
        }
      }
      return ''
    },
    // 经手人列表
    getUserList() {
      getAction(this.url.userList + '?abId=' + this.accountBookId).then((res) => {
        console.log('经手人', res)
        if (res.code == 200) {
          this.jsrOptions = res.result
          this.totalPersons = res.result
          // 默认经手人设置
          this.queryData.sysUserId = this.$lcStorage.get('xghUser').id
        } else {
          this.$message.error(res.message)
        }
      })
    },
    // 账户列表
    getBankList() {
      getAction('/xghBank/xghBank/listNoPage', {}).then((res) => {
        if (res.code == 200) {
          this.zhmcOptions = res.result
        } else {
          this.$message.error(res.message)
        }
      })
    },
    /**
     *  列配置方法
     */
    // 获取线上的列配置
    async selectTitle() {
      let obj = await this.$setColumn.selectColumn(this.url.api)
      if (obj.code === 200) {
        this.updateId = obj.updateId
        this.columnData = handleObjectToArray(obj.columnData, 'props')
      } else if (obj.code === 500) {
        let id = await this.$setColumn.addColumn(this.url.api, this.columnData)
        this.updateId = id
      }
    },
    // 触发列配置弹框
    onShowColumn() {
      this.defaultColumnData = this.$options.data().columnData
      this.$refs.setColumnRef.dialogVisible = true
    },
    // 修改列配置后保存修改后的值
    async onSaveColumn(value) {
      console.log(value, '保存列配置')
      this.columnData = value
      let res = await this.$setColumn.editColumn(this.url.api, this.columnData, this.updateId)
      if (res.code == 200) {
        this.$elMessage.success(res.message)
      } else {
        this.$elMessage.error(res.message)
      }
    },
    /**
     * 初始化默认获取缓存中存储的曾经点击过的供应商数据
     */
    getGysStorage() {
      getAction('/xghCompany/xghCompany/listNoPage', {}).then((res) => {
        if (res.code === 200) {
          this.gysOptions = res.result
          this.totalCompanys = res.result
        } else {
          this.$elMessage.error(res.message)
        }
      })
    },
    // 打开操作日志弹框
    onShowLog() {
      this.$refs.operationLogRef.getData(this.logData)
      this.logTitle = '单据操作日志'
      this.$refs.operationLogRef.dialogVisible = true
    },
    onShowAccountAdd() {
      this.$refs.accountAdd.show()
    },
    accountCallback(val) {
      console.log(val)
      this.getBankList()
    },
    // 打开新增往来单位弹出框
    onShowSupplierAdd() {
      this.newData = {
        id: '',
        companyName: '',
        companyUserName: '',
        xghCompanyNatureId: '',
        xghCompanyNature: '',
        companyPhone: '',
        companyPinyinCode: '',
        companyLandline: '',
        xghCompanyTypeId: '', //单位类别
        xghCompanyType: '',
        business: '',
        provinceName: '', //省
        provinceCode: '',
        cityName: '', //市
        cityCode: '',
        countyName: '', //区县
        countyCode: '',
        address: '',
        setPrice: '',
        setDiscountPrice: '',
        companyInvoiceStatus: true,
        depositBank: '',
        bankName: '',
        bakCard: '',
        taxNumber: '',
        invoiceAddress: '',
        bankPhone: '',
        companyRAndPStatus: true,
        beginReceivable: 0,
        beginPayable: 0,
        totalReceivable: 0,
        totalPayable: 0,
        receivableQuota: '',
        payableQuota: '',
        receivableTime: '',
        payableTime: '',
        companyRemark: '',
      }
      this.$refs.supplierAddRef.dialogVisible = true
    },
    // 新增往来单位数据
    onAddSupplier(val) {
      this.getGysStorage()
    },
    // 打开选择往来单位弹出框
    onShowSupplier() {
      this.$refs.supplierRef.dialogVisible = true
    },
    // 当前选择往来单位数据
    onSelectSupplier(val) {
      this.queryData.xghCompanyId = val.id
      this.queryData.settlementTypeId = '1'
      this.getCollectList()
    },
    // 当前选择往来单位数据
    onSelectCompany(val) {
      this.queryData.xghCompanyId = val
      this.queryData.settlementTypeId = '1'
      this.onSelectSklx('1')
    },

    jsrChange() {
      this.getCollectList()
    },

    // 提醒弹框确认后操作
    onYes(mark) {
      // 订单状态0.待审核5.审核通过10.作废15.反审20.红冲25.终止30.完成
      if (mark == 'onNewOrder') {
        this.orderStatus = 0
        this.onNewOrder()
      } else if (mark == 'onUpper') {
        // 上一单
        this.switchoverBill(1)
      } else if (mark == 'onLower') {
        // 下一单
        this.switchoverBill(2)
      } else if (mark == 'onChangeCk') {
        // 改变仓库
        // 根据出货仓库选择商品里的仓库
        this.getXghStorehouseIdById(false)
      } else if (mark == 'onToExamine') {
        // 审核
        getAction('/xghSettlementOrder/xghSettlementOrder/verify', {
          id: this.billId,
        }).then((res) => {
          if (res.code == 200) {
            this.orderStatus = '5'
            this.$refs.simplePrompt.show({
              index: 0,
              text: this.getMessageByChangeOrderStatus(this.orderStatus),
            })
            this.afterExamine()
          } else {
            this.$elMessage.error(res.message)
          }
        })
      } else if (mark == 'onToVoid') {
        // 作废
        this.updateOrder(10)
      } else if (mark == 'onToHongC') {
        // 红冲
        getAction('/xghSettlementOrder/xghSettlementOrder/redRush', {
          id: this.billId,
        }).then((res) => {
          if (res.code == 200) {
            this.orderStatus = '20'
            this.$refs.simplePrompt.show({
              index: 0,
              text: this.getMessageByChangeOrderStatus(this.orderStatus),
            })
          } else {
            this.$elMessage.error(res.message)
          }
        })
      } else if (mark == 'onToStop') {
        // 终止
        // this.updateOrder(25)
        this.stopOrder(2)
      } else if (mark == 'onToFinish') {
        // 完成
        this.stopOrder(1)
      } else if (mark == 'onCopy') {
        // 复制单据
        if (this.orderStatus != 66) {
          this.orderStatus = 66
          this.queryData.id = ''
          // let tableData = this.TableConfig.tableData || []
          // tableData.forEach((item) => {
          //   item.id = ''
          //   item.ignore = false
          // })
          this.paymentEcho.id = ''
          this.paymentEcho.xghCollectionPayInfoList.forEach((item) => {
            item.id = ''
          })
        }
        this.billId = ''
        this.logData.orderId = -1
        this.queryData.orderIndex = ''
        this.queryData.purchaseOrderStatus_dictText = ''
        this.queryData.orderNumber = ''
        this.queryData.orderTime = this.$formatDateTime()
        this.queryData.createOrderDate = this.$formatDateTime()
        this.queryData.createName = this.$lcStorage.get('xghUser').realname
        this.queryData.status = 0
        this.$refs.simplePrompt.show({
          index: 0,
          text: '单据复制成功',
        })
      }
    },
    hongchongSure() {
      // 红冲
      getAction('/xghSettlementOrder/xghSettlementOrder/redRush', {
        id: this.billId,
      }).then((res) => {
        if (res.code == 200) {
          this.orderStatus = '20'
          this.$refs.simplePrompt.show({
            index: 0,
            text: this.getMessageByChangeOrderStatus(this.orderStatus),
          })
        } else {
          this.showTips(res.message)
        }
      })
    },
    // 结算单更新接口
    updateOrder(state) {
      getAction('/xghSettlementOrder/xghSettlementOrder/changeStatus', {
        id: this.billId,
        code: state,
      }).then((res) => {
        if (res.code === 200) {
          this.orderStatus = state
          this.queryData.purchaseOrderStatus_dictText = this.getOrderStatusText(state)
          this.$refs.simplePrompt.show({
            index: 0,
            text: this.getMessageByChangeOrderStatus(state),
          })
        } else if (res.code === 500) {
          this.showTips(res.message)
        }
      })
    },
    stopOrder(state) {
      getAction('/xghPurchaseOrder/xghPurchaseOrder/stopOrder', {
        id: this.billId,
        code: state,
      }).then((res) => {
        if (res.code === 200) {
          this.queryData.status = state
          if (this.saveData) {
            this.saveData.status = state
          }
          this.$refs.simplePrompt.show({
            index: 0,
            text: this.getMessageByChangeOrderStatus(state),
          })
          this.handleOperationData()
        } else if (res.code === 500) {
          this.showTips(res.message)
        }
      })
    },
    // 修改附记
    async updatePostScript() {
      let orderStateNum = Number(this.orderStatus)
      if (orderStateNum >= 5 && orderStateNum < 66) {
        const res = await getAction('/xghSettlementOrder/xghSettlementOrder/addPostScript', {
          orderId: this.billId,
          postscript: this.queryData.postscript,
        })
        if (res.code == 200) {
          this.$elMessage.success('附记修改成功！')
        } else if (res.code === 500) {
          this.$elMessage.error(res.message)
        }
      }
    },

    showTips(msg) {
      this.$elMessage({
        showClose: true,
        message: msg || '',
        type: 'error',
        iconClass: 'el-icon-warning-outline',
        duration: 3000,
      })
    },

    getOrderStatusText(os) {
      let object = {
        0: '待审核',
        5: '已审核',
        10: '已作废',
        15: '待审核',
        20: '已红冲',
        25: '已终止',
        30: '已完成',
      }
      return object[os + '']
    },
    getMessageByChangeOrderStatus(os) {
      let object = {
        5: '单据审核成功',
        10: '单据作废成功',
        15: '单据反审成功',
        20: '单据红冲成功',
        2: '单据终止成功', //终止和完成使用执行状态
        1: '单据已完成',
      }
      return object[os + '']
    },

    /**
     *  操作方法
     */
    // 点击开新单
    onNewOrder() {
      // // 1.先判断当前页面的值是否保存，用弹出框给用户提醒
      // this.tipsData.tipsWords = '当前单据还未保存，</br>是否继续？'
      // this.tipsData.tipsMark = 'onNewOrder'
      // this.$refs.reminderRef.dialogVisible = true
      console.log('当前订单状态:', this.orderStatus)
      // 1.先判断当前页面的值是否保存，用弹出框给用户提醒
      if (this.orderStatus === 66 && this.getHaveChange()) {
        this.tipsData.tipsWords = '当前单据还未保存，</br>是否继续？'
        this.tipsData.tipsMark = 'onNewOrder'
        this.$refs.reminderRef.dialogVisible = true
      } else {
        this.orderFlag = 0
        this.pageNo = 0
        this.pageTotal = 1
        this.orderStatus = 66
        this.billId = ''
        this.logData.orderId = -1
        this.queryData = JSON.parse(JSON.stringify(this.$options.data().queryData))
        console.log(this.queryData)
        this.queryData.collectionTime = this.$formatDateTime()
        this.queryData.createOrderDate = this.$formatDateTime()
        this.queryData.createName = this.$lcStorage.get('xghUser').realname
        // 默认经手人设置
        this.queryData.sysUserId = this.$lcStorage.get('xghUser').id
        this.infoTableData = []
        this.paymentTableData = [
          {
            xhState: false,
            bankId: '',
            bankName: '',
            price: '',
            remark: '',
          },
        ]
        this.collectionPayPage = {}
      }
    },
    // 保存
    onSubmit() {
      // let obj = {
      //   ...this.queryData,
      //   tableData: { ...this.infoTableData },
      // }
      // console.log(obj, '保存单据')
      // this.tipsData.tipsWords = '保存成功！'
      // this.tipsData.tipsMark = 'onSubmit'
      // this.$refs.successRef.dialogVisible = true
      // orderType: 14  收款结算单
      if (!this.khyfkState) {
        if (this.selectTableData.length <= 0) {
          this.$elMessage.warning('请先选择核销应收明细')
          return
        }

        if (delcommafy(this.queryData.balance) != 0) {
          this.$elMessage.warning('本次收款金额合计与账户收款明细中的金额合计不一致！')
          return
        }
      }

      // 整单优惠价格
      let discountPrice = 0
      if (delcommafy(this.queryData.discountPrice) > 0) {
        discountPrice = delcommafy(this.queryData.discountPrice)
      }
      // 账户列表价格
      console.log(JSON.stringify(this.paymentTableData))
      let bankPrice = 0
      this.paymentTableData.forEach((item) => {
        if (item.price) {
          bankPrice = accAdd(bankPrice, delcommafy(item.price))
        }
      })

      // 判断是否选择账户，必须选择账户，可以输0，不能不选
      let bankList = this.paymentTableData.filter((item) => item.bankId != '')
      if (!bankList || bankList.length <= 0) {
        this.$elMessage.warning('请先选择账户！')
        return
      }

      // 选中收款结算列表价格
      let balance = 0
      this.selectTableData.forEach((item) => {
        item.thisPrice = item.thisPrice || 0
        if (item.thisPrice) {
          balance = accAdd(balance, item.thisPrice)
        }
      })

      // 不是客户预付款的情况下判断明细金额
      if (!this.khyfkState) {
        // 明细中收款金额至少有一个不为0，全为0，不能继续
        let newList = this.selectTableData.filter((item) => item.thisPrice != 0)
        if (!newList || newList.length <= 0) {
          this.$elMessage.warning('明细中收款金额不能全为0')
          return
        }
      }

      /**
       * 不限制明细合计是否为0，不限制预付款金额是否为0
       */
      // if (balance <= 0) {
      //   this.$elMessage.warning('本次收款金额合计不能为0！')
      //   return
      // }

      // 限制预付款金额不能为0
      if (this.khyfkState) {
        if (bankPrice + discountPrice <= 0) {
          this.$elMessage.warning('预付款金额不能为0！')
          return
        }
      }

      let digest = []
      let payList = this.paymentTableData.map((item) => {
        item.xghAccountBookId = this.accountBookId
        item.isBegin = 1 //是否期初0：是期初 1：不是
        item.payType = 1 //收付类型1:收款2：付款
        item.companyId = this.queryData.xghCompanyId
        item.companyType = 2 //单位类型1:快递收付 2;往来单位收付3：银行账户id
        item.price = delcommafy(item.price || 0)
        digest.push(`[${item.bankName},${item.price}]`)
        return item
      })

      this.queryData.isReplacementOrder = this.queryData.isReplacementOrder ? '0' : '1' //是否补单-0：是 1:不是
      let obj = {}
      let t_p = delcommafy(discountPrice) + delcommafy(bankPrice)
      obj.collectionPayPage = {
        ...this.collectionPayPage,
        xghCollectionPayInfoList: payList,
        isBegin: 1, //是否期初0：是期初 1：不是
        isDeposit: 0, //是否定金0:是1:不是
        payType: 1, //收付类型1:收款2：付款
        price: this.khyfkState ? t_p * -1 : t_p,
        orderType: '14', //采购订单1/采购入库单2/采购退货单3/采购换货单4/销售订单5/销售出库单6/销售退货单7/销售换货单8/盘点单9/报损单10/
        companyId: this.queryData.xghCompanyId,
        companyType: '2',
        xghAccountBookId: this.accountBookId,
        settlementStatus: '0', //结算单状态0保存 5.审核 20 红冲
        status: this.khyfkState ? 0 : 2, //结销状态0：未结1：部分结销2:已结销
        receivablePrice: this.khyfkState ? delcommafy(this.queryData.price) : delcommafy(balance), //应收金额
        balance: this.khyfkState ? delcommafy(this.queryData.price) : 0,
        settlementType: this.queryData.settlementTypeId,
      }
      this.queryData.xghSettlementOrderInfoList = this.selectTableData
      obj.xghSettlementOrderPage = {
        ...this.queryData,
        xghAccountBookId: this.accountBookId,
        createOrderDate: this.billId ? this.queryData.createOrderDate : '',
        summary: digest.join(';'), //摘要
      }
      const that = this
      let url = '/xghSettlementOrder/xghSettlementOrder/add'
      if (this.billId) {
        url = '/xghSettlementOrder/xghSettlementOrder/edit'
      }
      postAction(url, obj).then((res) => {
        console.log('保存---', res)
        if (res.code == 200) {
          // that.$elMessage.success('保存成功！')
          this.tipsData.tipsWords = '保存成功！'
          this.tipsData.resultType = 1
          this.$refs.successRef.dialogVisible = true
          this.handleData(res.result)
        } else {
          that.$elMessage.error(res.message)
        }
      })
    },
    // 当操作成功后点击了确定按钮之后进行的下一步操作：
    onOptionSuccess() {
      if (this.tipsData.resultType == 1) {
        this.tipsData.resultType == -1
        // 保存成功了
        console.log('操作成功后点击确定按钮了')
        this.toSaveOrExamine()
      } else if (this.tipsData.resultType == 2) {
        this.tipsData.resultType == -1
        // 审核成功了
        console.log('审核成功后点击确定按钮了')
        this.afterExamine()
      }
    },
    // 单据保存后的走向
    toSaveOrExamine() {
      if (this.isSaveExamine && this.buttonsPermissions.ShenHe) {
        // 保存后立即审核,且有审核权限
        setTimeout(() => {
          this.onToExamine()
        }, 1000)
      } else if (this.isSaveNewOrder && this.buttonsPermissions.LuRu) {
        // 如果保存后立即开新单,并且有新增权限
        this.onYes('onNewOrder')
      }
    },
    afterExamine() {
      // 如果审核后立即开新单
      if (this.isExamineNewOrder && this.buttonsPermissions.LuRu) {
        this.onYes('onNewOrder')
      }
    },
    // 审核单据
    onToExamine() {
      let payTable = JSON.parse(JSON.stringify(this.paymentTableData))
      payTable.forEach((item) => {
        item.price = formatMoney(item.price)
      })
      let queryData = JSON.parse(JSON.stringify(this.queryData))
      delete queryData['price']
      var data = JSON.parse(
        JSON.stringify({
          ...queryData,
          ...this.selectTableData,
          ...payTable,
        })
      )
      // console.log('JSON.stringify(data)',data)
      // console.log('JSON.stringify(this.saveData)',this.saveData)
      // console.log(JSON.stringify(data))
      // console.log(JSON.stringify(this.saveData))
      if (JSON.stringify(data) === JSON.stringify(this.saveData)) {
        this.tipsData.tipsWords = '确定要审核当前的单据吗？'
        this.tipsData.tipsMark = 'onToExamine'
        this.$refs.reminderRef.dialogVisible = true
      } else {
        this.$elMessage.warning('请先保存！')
      }
    },
    // 操作选择
    operationSelect(value) {
      switch (value) {
        case '作废':
          this.tipsData.tipsWords = '确定要作废当前的单据吗？'
          this.tipsData.tipsMark = 'onToVoid'
          this.$refs.reminderRef.dialogVisible = true
          break
        case '红冲':
          this.$refs.simplePrompt.show({
            index: 1,
            text: '确定要红冲当前的业务单据吗？</br>注：对应的应收款记录将会被自动红冲',
          })
          break
        case '终止':
          if (this.orderStatus == 66) {
            this.showTips('当前业务单据还未保存，不能进行终止操作')
          } else {
            this.tipsData.tipsWords = '确定要终止当前的单据吗？'
            this.tipsData.tipsMark = 'onToStop'
            this.$refs.reminderRef.dialogVisible = true
          }
          break
        case '完成':
          this.tipsData.tipsWords = '确定要完成当前的单据吗？'
          this.tipsData.tipsMark = 'onToFinish'
          this.$refs.reminderRef.dialogVisible = true
          break
        default:
          break
      }
      this.operationValue = '操作'
    },
    // 调单选择
    exchangeSelect() {
      this.exchangeValue = '调单'
    },
    // 导出选择
    exportExcel() {
      this.importValue = '导出'

      let queryParam = {
        fileName: '收款结算单',
        orderId: this.billId,
        type: 14,
      }
      this.handleExportXlsByStaff('收款结算单', queryParam)
    },
    // 分享
    onShare() {
      if (!this.billId) {
        this.$elMessage.warning('未保存单据无法分享！')
      } else if (this.buttonsPermissions.FenXiang) {
        let base = window._CONFIG['domianURL'].replace('api', '').replace('10030', '9047')
        let bookId = Vue.ls.get(ACCOUNT_BOOK).id
        let url = `${base}share?from=skjsd&aid=${bookId}&bid=${this.billId}`
        window.open(url)
      } else {
        this.$elMessage.warning('没有分享权限！')
      }
    },
    /**
     *  上下调单
     */
    // 上一条
    onUpper() {
      if (this.orderStatus == 66 && this.getHaveChange()) {
        this.tipsData.tipsWords = '当前单据还未保存，</br>是否继续？'
        this.tipsData.tipsMark = 'onUpper'
        this.$refs.reminderRef.dialogVisible = true
      } else {
        this.switchoverBill(1)
      }
    },
    // 下一条
    onLower() {
      if (this.orderStatus == 66 && this.getHaveChange()) {
        this.tipsData.tipsWords = '当前单据还未保存，</br>是否继续？'
        this.tipsData.tipsMark = 'onLower'
        this.$refs.reminderRef.dialogVisible = true
      } else {
        this.switchoverBill(2)
      }
    },
    switchoverBill(flag) {
      if (this.orderFlag === 0) {
        this.orderFlag = flag
      }
      if (flag === 1) {
        if (
          this.pageTotal === 0 ||
          (this.orderFlag === 1 && this.pageNo === this.pageTotal) ||
          (this.orderFlag === 2 && this.pageNo === 1)
        ) {
          this.$elMessage.warning('已经是第一条了')
          return
        }
        let value = this.orderFlag === 1 ? 1 : -1
        this.pageNo += value
        this.upperLoading = true
        this.getOrderData('0')
      } else if (flag === 2) {
        if (
          this.pageTotal === 0 ||
          (this.orderFlag === 1 && this.pageNo === 1) ||
          (this.orderFlag === 2 && this.pageNo === this.pageTotal)
        ) {
          this.$elMessage.warning('已经是最后一条了')
          return
        }
        let value = this.orderFlag === 1 ? -1 : 1
        this.pageNo += value
        this.lowerLoading = true
        this.getOrderData('1')
      }
    },
    /**
     * 获取当前单据数据
     */
    getOrderData(type) {
      let data = {
        orderFlag: this.orderFlag,
        pageSize: 1,
        pageNo: this.pageNo,
        type: '14',
        orderId: this.billId || '',
      }
      getAction('/xghSettlementOrder/xghSettlementOrder/preOrNextOrder', data).then(
        (res) => {
          this.lowerLoading = false
          this.upperLoading = false

          if (res.code === 200) {
            this.pageTotal = res.result.total || 1
            this.pageNo = res.result.current
            let list = res.result.records || []
            if (list.length) {
              // 处理请求到的数据
              this.handleData(list[0])
            } else {
              if (type == 0) {
                this.$elMessage.warning('已经是第一条了')
              } else {
                this.$elMessage.warning('已经是最后一条了')
              }
            }
          } else if (res.code === 500) {
            this.showTips(res.message)
          }
        },
        (error) => {
          this.lowerLoading = false
          this.upperLoading = false
        }
      )
    },
    // 处理请求到的数据
    handleData(res) {
      console.log('处理请求到的数据', res)
      this.$refs.tableRef.clearSelection()

      this.collectionPayPage = res.collectionPayPage
      this.paymentTableData = (res.collectionPayPage && res.collectionPayPage.xghCollectionPayInfoList) || []
      this.orderStatus = res.xghSettlementOrderPage.orderStatus
      this.billId = res.xghSettlementOrderPage.id
      this.logData.orderId = res.xghSettlementOrderPage.id

      this.queryData = {
        ...this.queryData,
        ...res.xghSettlementOrderPage,
        balance: formatMoney(0),
        isReplacementOrder: res.xghSettlementOrderPage.isReplacementOrder == 0 ? true : false,
      }
      this.infoTableData = res.xghSettlementOrderPage.xghSettlementOrderInfoList
      this.selectTableData = res.xghSettlementOrderPage.xghSettlementOrderInfoList
      let that = this
      this.$nextTick(() => {
        //   that.selectTableData = []
        // that.$refs.tableRef.clearSelection()
        //   that.infoTableData.forEach((item) => {
        //     console.log(item.thisPrice)
        //     if (item.thisPrice) {
        //       that.selectTableData.push(item)
        //     }
        //   })
        that.selectTableData.forEach((row) => {
          that.$refs.tableRef.toggleRowSelection(row, true)
        })
      })

      this.$nextTick(() => {
        // 添加打印数据
        this.printData = {
          ...this.queryData,
          xghCompanyId_dictText: this.$refs.deptSelect.selected.label,
          paymentTableData: this.paymentTableData,
          infoTableData: this.infoTableData,
        }
      })
      let payTable = JSON.parse(JSON.stringify(this.paymentTableData))
      payTable.forEach((item) => {
        item.price = formatMoney(item.price)
      })
      let queryData = JSON.parse(JSON.stringify(this.queryData))
      delete queryData['price']
      // queryData.balance = formatMoney(this.queryData.balance)
      this.saveData = JSON.parse(
        JSON.stringify({
          ...queryData,
          ...this.selectTableData,
          ...payTable,
        })
      )
      console.log('打印数据', this.printData)
    },
    // 判断是否有修改
    getHaveChange() {
      //获取源数据，将订单状态置成新单状态
      let source = JSON.parse(JSON.stringify(this.$options.data().queryData))
      source.sysUserId = this.$lcStorage.get('xghUser').id
      // 获取现有数据，移除自动添加的值
      let current = JSON.parse(JSON.stringify(this.queryData))
      current.collectionTime = ''
      current.createOrderDate = ''
      current.createName = ''
      // 判断当前数据是否和源数据相同，相同表示未做修改
      let sourceStr = JSON.stringify(source)
      let currentStr = JSON.stringify(current)
      console.log(sourceStr)
      console.log(currentStr)
      return sourceStr != currentStr
    },

    // 生成收款码
    onCollectionCode() {},
    // 自动分配
    onAutomaticAllocation() {
      if (!this.queryData.xghCompanyId || this.queryData.xghCompanyId == '') {
        // 请先选择往来单位
        this.$alert('请先选择往来单位', '提示信息', {
          confirmButtonText: '确定',
        })
        return
      }
      if (!this.infoTableData || this.infoTableData.length == 0) {
        // 没有需要核销的应收款记录，无法自动分配收款！
        this.$alert('没有需要核销的应收款记录，无法自动分配收款！', '提示信息', {
          confirmButtonText: '确定',
        })
        return
      }
      // 整单优惠价格
      let discountPrice = 0
      if (delcommafy(this.queryData.discountPrice) > 0) {
        discountPrice = delcommafy(this.queryData.discountPrice)
      }
      // 账户列表价格
      let bankPrice = 0
      this.paymentTableData.forEach((item) => {
        if (item.price) {
          bankPrice = accAdd(bankPrice, delcommafy(item.price))
        }
      })
      let price = accAdd(discountPrice, bankPrice)
      console.log('可结算金额', price, discountPrice, bankPrice)
      // if (delcommafy(price) > 0) {
      const that = this
      // 自动分配会覆盖您已录入的本次付金额，是否继续？
      this.$confirm({
        title: '提示信息',
        content: '自动分配会覆盖您已录入的本次付金额，是否继续？',
        okText: '是',
        okType: 'warn',
        cancelText: '否',
        onOk() {
          console.log('OK')
          that.selectTableData = []
          that.$refs.tableRef.clearSelection()
          that.infoTableData.forEach((item) => {
            if (delcommafy(item.surplusPrice) < 0) {
              item.thisPrice = item.surplusPrice
              price = accSub(price, item.surplusPrice)
              that.selectTableData.push(item)
            }
          })
          that.infoTableData.forEach((item) => {
            if (delcommafy(item.surplusPrice) > 0) {
              if (delcommafy(price) > delcommafy(item.surplusPrice)) {
                item.thisPrice = item.surplusPrice
                price = accSub(price, item.surplusPrice)
                that.selectTableData.push(item)
              } else if (delcommafy(price) <= delcommafy(item.surplusPrice) && delcommafy(price) > 0) {
                item.thisPrice = price
                price = 0
                that.selectTableData.push(item)
              }
            } else if (delcommafy(item.surplusPrice) == 0 && delcommafy(price) > 0) {
              item.thisPrice = 0
              that.selectTableData.push(item)
            }
          })
          console.log(that.selectTableData)
          that.selectTableData.forEach((row) => {
            that.$refs.tableRef.toggleRowSelection(row, true)
          })
          that.queryData.balance = delcommafy(price)
          that.$elMessage.warning('系统已自动分配应收款！')
        },
        onCancel() {
          console.log('Cancel')
        },
      })
      // } else {
      //   this.$elMessage.warning('系统已自动分配应收款！')
      // }
    },
    // 删除table勾选的行
    onDeleteTable() {
      if (this.infoTableData.length == 0 || this.selectTableData.length == 0) {
        return this.$elMessage.warning('请选择要删除的明细！')
      }
      this.infoTableData = this.infoTableData.filter(item => !this.selectTableData.includes(item))
    },
    // 刷新明细
    onRefreshSub() {
      if (!this.queryData.xghCompanyId || this.queryData.xghCompanyId == '') {
        // 请先选择往来单位
        this.$alert('请先选择往来单位', '提示信息', {
          confirmButtonText: '确定',
        })
        return
      }
      // 刷新明细会覆盖您已录入的本次付金额，是否继续？
      const that = this
      this.$confirm({
        title: '提示信息',
        content: '刷新明细会覆盖您已录入的本次付金额，是否继续？',
        okText: '是',
        okType: 'warn',
        cancelText: '否',
        onOk() {
          console.log('OK')
          that.selectTableData = []
          that.getCollectList()
        },
        onCancel() {
          console.log('Cancel')
        },
      })
    },
    // 查看应收款
    onViewReceivables() {
      if (this.selectTableData.length == 1) {
        console.log(this.selectTableData[0])
        let id = this.selectTableData[0].documentOrderId
        let orderNumber = this.selectTableData[0].settlementOrderNumber || ''
        if (orderNumber.indexOf('xsckd') > -1) {
          this.$router.push({ name: 'saleManage-salesBill-billSalesDelivery', params: { billId: id } })
        } else if (orderNumber.indexOf('xsthd') > -1) {
          this.$router.push({ name: 'saleManage-salesBill-billSalesReturn', params: { billId: id } })
        } else if (orderNumber.indexOf('xshhd') > -1) {
          if (!handlePagePermissions('销售换货')) {
            return this.$elMessage.warning('没有权限！')
          }
          this.$router.push({ name: 'saleManage-salesBill-billSalesExchange', params: { billId: id } })
        } else {
          this.$elMessage.warning('暂不支持查看该单据')
        }
      } else if (this.selectTableData.length > 1) {
        this.$elMessage.warning('每次只能选择一条要查看的单据')
      } else {
        this.$elMessage.warning('请选择要查看的单据')
      }
    },
    // 切换收款类型改变提示文字
    onSelectSklx(val) {
      this.skjsState = false
      this.khyfkState = false
      this.xstkState = false
      if (val == '1') {
        this.skjsState = true
      } else if (val == '2') {
        this.khyfkState = true
      } else if (val == '3') {
        this.xstkState = true
      }
      this.queryData.discountPrice = ''
      this.paymentTableData = [
        {
          xhState: false,
          bankId: '',
          bankName: '',
          price: '',
          remark: '',
        },
      ]
      this.getCollectList()
      this.calcbalance()
    },
    // 整单优惠输入变化
    discountPriceInput(e) {
      let price = e.target.value
      if (price.indexOf('.') >= 0) {
        let list = price.split('.')
        if (list.length > 1) {
          price = price.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3') //只能输入两个小数
          price = delcommafy(price)
        }
      }
      this.queryData.discountPrice = price
    },
    // 设置‘本次收款金额’列颜色
    setCellColor({ row, column, rowIndex, columnIndex }) {
      if (column.property === 'thisPrice') {
        return 'color:#1b94fb;'
      }
      if (columnIndex == 1) {
        return 'text-align:center;'
      }
    },
    // 点击支付账户表
    onClickTablePayment(row) {
      this.paymentTableData.forEach((item) => {
        if (item.id) {
          item.xhState = false
        }
      })
    },
    // 新增一条支付账户数据
    addRowPayment(index) {
      let obj = {
        xhState: false,
        bankId: '',
        bankName: '',
        price: '',
        remark: '',
      }
      this.paymentTableData.splice(index + 1, 0, obj)
      this.paymentTableData.forEach((item) => {
        if (item.id) {
          item.xhState = true
        }
      })
    },
    deleteRowPayment(index) {
      this.paymentTableData.splice(index, 1)
    },
    // 新增数据中表格内输入框聚焦时选中
    focusinSelect() {
      // event.target.select()
    },
    // 账户选择
    bankNameChange(e, args) {
      console.log('shuju:', args)
      this.zhmcOptions.forEach((item) => {
        if (item.bankName == e) {
          args.bankId = item.id
        }
      })
    },
    // 本次收款金额失焦
    focusoutThisPrice(item) {
      console.log('本次收款金额', item)
      if (!item.thisPrice || delcommafy(item.thisPrice) == 0) {
        this.$refs.tableRef.toggleRowSelection(item, false)
      } else {
        this.$refs.tableRef.toggleRowSelection(item, true)
      }
      this.calcbalance()
    },
    // 计算可结算金额
    calcbalance() {
      console.log('触发计算');
      
      // 整单优惠价格
      let discountPrice = 0
      if (delcommafy(this.queryData.discountPrice) > 0) {
        discountPrice = delcommafy(this.queryData.discountPrice)
      }
      // 账户列表价格
      let bankPrice = 0
      this.paymentTableData.forEach((item) => {
        // item.price = item.price || 0
        if (item.price) {
          if (this.xstkState || this.queryData.settlementTypeId == 3) {
            // 退款 负数不处理
            item.price = formatMoney(delcommafy(item.price))
          } else {
            // 非退款 取绝对值
            item.price = formatMoney(Math.abs(delcommafy(item.price)))
          }
          bankPrice = accAdd(bankPrice, delcommafy(item.price))
        }
      })
      console.log(bankPrice);
      
      if (this.khyfkState) {
        this.queryData.price = bankPrice * -1
      } else {
        this.queryData.price = bankPrice
      }
      console.log(bankPrice);
      console.log(this.queryData.price)
      // 选中收款结算列表价格
      let balance = 0
      this.selectTableData.forEach((item) => {
        item.thisPrice = item.thisPrice || 0
        if (item.thisPrice) {
          balance = accAdd(balance, item.thisPrice)
        }
      })
      console.log('queryData.balance', balance)
      this.queryData.balance = formatMoney(accSub(accAdd(discountPrice, bankPrice), balance))
      console.log('queryData.balance', this.queryData.balance)
    },
    // 历史记录数据去重并只展示三个数据方法
    selectDataHas(arr) {
      let map = new Map()
      for (const item of arr) {
        if (!map.has(item.id)) {
          map.set(item.id, item)
        }
      }
      let newArr = [...map.values()]
      return newArr.slice(0, 3)
    },
    // 请求筛选条件数据
    requestQuery(obj) {
      console.log(obj, '请求')
    },

    // 设置列配置（实现列的显示隐藏、列名修改、还原默认值；上下移动列未实现）
    setColumn() {
      let getTable = document.getElementsByClassName('table_content')[0]
      let getTr = getTable.getElementsByTagName('tr')
      getTr.forEach((item) => {
        let getTd = item.getElementsByClassName('set_order')
        getTd.forEach((item, index) => {
          // item.style.order = this.newColumnData[index].zidingyiSort
          if (this.newColumnDataOut[index].zidingyiState == false) {
            item.style.display = 'none'
          } else {
            item.style.display = 'block'
          }
        })
      })
      let getTh = getTr[0].getElementsByClassName('set_order')
      getTh.forEach((item, index) => {
        // item.style.order = this.newColumnData[index].zidingyiSort
        if (this.newColumnDataOut[index].zidingyiState == false) {
          item.style.display = 'none'
        } else {
          item.style.display = 'block'
        }
      })
    },
    // 列配置取消按钮触发
    onCancelColumn() {
      this.showLiepeizhi = false
    },
    // 监听列表选择变化
    handleSelectionChange(val) {
      this.selectTableData = val
      this.calcbalance()
    },
    // 自定义合计计算方式
    getBankSummaries(param) {
      const { columns, data } = param
      const sums = []
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计'
        } else if (index === 1) {
          sums[index] = '共' + this.paymentTableData.length + '条明细'
        } else if (column.property == 'price') {
          const values = data.map((item) => delcommafy(item[column.property]))
          if (!values.every((value) => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = delcommafy(curr)
              if (!isNaN(value)) {
                return prev + curr
              } else {
                return prev
              }
            }, 0)
            sums[index] = this.$formatMoney(sums[index])
          }
        } else {
          sums[index] = ''
        }
      })
      return sums
    },
    // 自定义合计计算方式
    getSummaries(param) {
      this.$nextTick(() => {
        this.$refs.tableRef.doLayout()
      })
      const { columns, data } = param
      const sums = []
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计'
        } else if (index === 2) {
          sums[index] = '共' + this.infoTableData.length + '条明细'
        } else if (
          column.property == 'allPrice' ||
          column.property == 'offPrice' ||
          column.property == 'surplusPrice' ||
          column.property == 'thisPrice'
        ) {
          const values = data.map((item) => delcommafy(item[column.property]))
          if (!values.every((value) => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = delcommafy(curr)
              if (!isNaN(value)) {
                return prev + curr
              } else {
                return prev
              }
            }, 0)
            sums[index] = this.$formatMoney(sums[index])
          }
        } else {
          sums[index] = ''
        }
      })
      return sums
    },
    // 获取每页几条数据
    handleSizeChange(val) {
      this.pagesize = val
    },
    // 获取当前第几页
    handleCurrentChange(val) {
      this.currentPage = val
    },
    // 搜索
    handleFilterMethod(value, label) {
      if (label == 'companyName') {
        this.gysOptions = this.filterMethod(this.gysOptions, value, label)
      } else if (label == 'realname') {
        this.jsrOptions = this.filterMethod(this.jsrOptions, value, label)
      }
    },
    // 控制输入不能超过限制位数
    inputMoney(key, val) {
      //首位不能输入"."
      val[key] = val[key].replace(/^\./g, '0.')
      val[key] = val[key].replace(/\.{2,}/g, '.') //只保留第一个. 清除多余的
      val[key] = val[key].replace('.', '$#$').replace(/\./g, '').replace('$#$', '.')
      if (this.moneyLength === 2) {
        // 小数点后面保留2位
        val[key] = val[key].replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3')
      } else {
        // 小数点后面保留4位
        val[key] = val[key].replace(/^(\-)*(\d+)\.(\d\d\d\d).*$/, '$1$2.$3')
      }
      // 限制只能输入数字 . -
      val[key] = val[key].replace(/[^\d.-]/g, '')
      if (val[key].indexOf('-') > 0) {
        val[key] = val[key].replace(/-/g, ''); // 移除非首位的减号
      }
    },
    // 键盘enter键处理
    // 客户
    handleCompanyEnter() {
      if (!this.queryData.xghCompanyId) {
        this.onShowSupplierAdd()
      }
    },
  },
}
</script>

<style lang="scss" scoped>
.basic_info {
  width: 100%;
  height: calc(100vh - 1.875117rem);
  background: #f0f2f5;
  box-sizing: border-box;
  padding: 0 0.168761rem 0.168761rem;
  display: flex;
  flex-direction: column;
}

.info_operation_btn {
  width: 100%;
  height: 50px;
  display: flex;
  align-items: center;
  font-size: 12px;
  ::v-deep .el-button {
    width: 70px;
    height: 30px;
    text-align: center;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    border-radius: 0.1rem;
    border: none;
    margin-right: 0.1rem;
    margin-left: 0;
  }

  .el-button--default {
    color: #666;
  }

  ::v-deep .el-select {
    width: 70px;
    height: 30px;
    box-sizing: border-box;
    margin-right: 0.1rem;

    .el-input {
      .el-input__inner {
        width: 100%;
        height: 30px;
        border: none;
        font-size: 12px;
      }

      .el-input__suffix {
        height: 30px;
        display: flex;
        align-items: center;
      }
    }
  }

  ::v-deep .el-checkbox {
    display: flex;
    align-items: center;
    margin-left: 0.168761rem;
    height: 20px;

    .el-checkbox__input {
      height: 100%;
      vertical-align: middle;
      display: flex;
      align-items: center;
    }

    .el-checkbox__label {
      font-size: 12px;
      padding-left: 0.1rem;
      color: #666;
      vertical-align: middle;
    }

    .is-checked {
      .el-checkbox__inner {
        background: #1a93fa;
        border-color: #1a93fa;
      }
    }
  }

  .btn_left {
    width: calc(100% - 100px);
    height: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;

    div {
      font-size: 12px;
      color: #666;
      // margin-right: 0.25rem;
    }

    .arrow_btn {
      width: 30px;
      background: #ffffff;
      padding: 0;
      margin-right: 0.25rem;
    }
  }

  .btn_right {
    width: 100px;
    height: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;

    ::v-deep .el-input {
      width: 2.812676rem;
      height: 30px;

      .el-input__inner {
        height: 30px;
        line-height: 30px;
        padding: 0 0.15rem;
        font-size: 12px;
        color: #666;
      }
    }

    .search_order {
      display: flex;
      align-items: center;

      div {
        margin-right: 0;
      }
    }

    ::v-deep .el-button {
      width: 30px;
      height: 30px;
      text-align: center;
      box-sizing: border-box;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      border-radius: 0.1rem;
      border: none;
      margin-right: 0.112507rem;
      margin-left: 0;
    }
  }
}

.info_content_div {
  width: 100%;
  height: calc(100% - 1rem);
  background: #fff;
  box-sizing: border-box;
  padding: 0 0.168761rem;
  display: flex;

  .div_table {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;

    .div_screen {
      width: 100%;
      height: 0.8rem;
      display: flex;
      justify-content: space-between;

      ::v-deep .el-select {
        width: 2.250141rem;
        height: 30px;
        box-sizing: border-box;
        border-radius: 4px;
        margin-left: 0.1rem;

        .el-input {
          .el-input__inner {
            height: 30px;
            border-color: #e3e3e3;
            font-size: 12px;
            padding-left: 0.150009rem;
          }

          .el-input__suffix {
            height: 30px;
            display: flex;
            align-items: center;
          }
        }
      }

      input {
        width: 2.250141rem;
        height: 30px;
        background: #ffffff;
        border: 1px solid #e3e3e3;
        opacity: 1;
        border-radius: 4px;
        font-size: 12px;
        color: #666;
        box-sizing: border-box;
        padding: 0 0.150009rem;
        margin-left: 0.1rem;

        &:focus {
          outline: none;
          border-color: #1890ff;
        }
      }

      .screen_left {
        width: calc(100% - 0.375023rem);
        height: 100%;
        box-sizing: border-box;
        display: flex;
        justify-content: flex-start;
        flex-wrap: wrap;

        > div {
          width: 3.281455rem;
          width: 3.375211rem;
          height: 30px;
          margin-top: 0.25rem;
          box-sizing: border-box;
          display: flex;
          align-items: center;
          margin-right: 0.25rem;

          > p {
            margin: 0;
            // width: 70px;
            // margin-right: 0.1rem;
            font-size: 12px;
            font-family: PingFang SC;
            font-weight: 400;
            color: #666666;
            // text-align: justify;
            // text-justify: distribute-all-lines;
            // /*ie6-8*/
            // text-align-last: justify;
            // /* ie9*/
            // -moz-text-align-last: justify;
            // /*ff*/
            // -webkit-text-align-last: justify;
            /*chrome 20+*/
          }

          > span {
            font-size: 15px;
            color: #ff0000;
          }
        }

        .line_dialog {
          .dialog_input {
            flex: 1;
            position: relative;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            margin-right: 0;
            margin-left: 0.1rem;
            text-align: left;
            text-align-last: left;

            ::v-deep .el-select {
              i {
                display: none;
              }
            }

            i {
              position: absolute;
              right: 0.12rem;
              color: #bfbfbf;
              font-size: 15px;
              cursor: pointer;
            }
          }
        }

        > .date_div {
          .date_style {
            width: 2.156385rem;
            height: 30px;
            border-radius: 0.075rem;
            margin-left: 0.1rem;

            ::v-deep .el-date-editor {
              width: 100%;
              height: 30px;

              .el-input__inner {
                width: 100%;
                height: 30px;
                padding: 0 0.187512rem;
                font-size: 12px;
                color: #666;
              }

              .el-input__prefix {
                left: unset;
                right: 5px !important;

                .el-input__icon {
                  line-height: 30px;
                  font-size: 20px;
                }
              }

              .el-input__suffix {
                display: none;
              }
            }

            ::v-deep .el-input.is-disabled {
              .el-input__inner {
                background-color: #ededed;
                border: 1px solid #e3e3e3;

                color: #999;
              }

              .el-input__icon {
                color: #999;
              }
            }
          }
        }

        // .date_picker_style {
        //   width: 2.250141rem;
        //   height: 30px;
        //   background: #ffffff;
        //   border: 1px solid #d9d9d9;
        //   border-radius: 0.075005rem;
        //   position: relative;
        //   display: flex;
        //   align-items: center;
        //   justify-content: space-between;
        //   box-sizing: border-box;
        //   padding: 0.1rem;
        //   margin-left: 0.1rem;
        //   p {
        //     width: 100%;
        //     height: 30px;
        //     margin: 0;
        //     font-size: 0.018751rem;
        //     color: #666;
        //     font-family: HelveticaNeue;
        //     line-height: 30px;
        //   }
        //   i {
        //     font-size: 0.25rem;
        //     color: #d9d9d9;
        //   }
        //   ::v-deep .el-date-editor {
        //     width: 3.375211rem;
        //     height: 30px;
        //     opacity: 0;
        //     position: absolute;
        //     top: 0;
        //     left: 0;
        //     z-index: 2001;
        //     .el-input__inner {
        //       width: 100%;
        //       height: 30px;
        //     }
        //     .el-range-input {
        //       font-size: 12px;
        //     }
        //     .el-range-separator {
        //       line-height: 30px;
        //       font-size: 12px;
        //     }
        //   }
        // }
      }
    }

    .table_content {
      height: calc(100% - 0.8rem - 1rem);
      box-sizing: border-box;
      display: flex;
      flex-direction: column;

      .content_div1 {
        width: 100%;
        height: 35%;
      }

      .content_div {
        width: 100%;
        height: 65%;
      }

      .table_Div1 {
        width: 100%;
        height: calc(100% - 15px);
      }

      .table_title {
        width: 100%;
        height: 0.8rem;
        display: flex;
        align-items: center;
        justify-content: space-between;

        > div {
          display: flex;
          align-items: center;

          div,
          span {
            font-size: 12px;
            font-family: PingFang SC;
            color: #666;
          }

          div {
            margin-right: 0.25rem;

            &:first-child {
              font-size: 15px;
              font-weight: 600;
            }

            &:last-child {
              color: #ff0000;
            }
          }

          span {
            &:last-child {
              font-size: 25px;
              color: #ff6c00;
              font-weight: 600;
            }
          }

          ::v-deep .el-button {
            width: 70px;
            height: 30px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 12px;
            color: #666;
          }

          ::v-deep .el-button--primary {
            background-color: #1b94fb;
            color: #fff;
          }

          ::v-deep .is-plain {
            background-color: #fff;
            border-color: #1b94fb;
            color: #1b94fb;
          }

          .set_up {
            font-size: 23px;
            color: rgb(153, 153, 153);
            margin-right: 0.1rem;
            margin-left: 0.187512rem;
          }
        }
      }

      .table_Div {
        width: 100%;
        height: calc(100% - 0.8rem);
      }

      ::v-deep .el-table {
        border: 1px solid #e3e3e3;
        box-sizing: border-box;

        th,
        td {
          padding: 0;
          color: #666;
          box-sizing: border-box;
          border-right: 1px solid #e3e3e3;

          .cell {
            height: 30px;
            display: flex;
            align-items: center;
            font-size: 12px;
            padding: 0;
            // line-height: 30px;

            .index_select {
              display: flex;
              align-items: center;
              width: 100%;
              height: 100%;

              .el-select {
                width: 100%;
                height: 100%;

                .el-input {
                  display: flex;
                  height: 100%;

                  .el-input__inner {
                    height: 100%;
                    font-size: 12px;
                    color: #666;
                    border-radius: 0;
                    border: none;
                  }

                  .el-input__icon {
                    line-height: 100%;
                  }
                }
              }
            }

            .index_input {
              display: flex;
              align-items: center;
              width: 100%;
              height: 100%;

              input {
                width: 100%;
                height: 100%;
                padding: 0 10px;
                border-radius: 0;
                background: #ffffff;
                border: none;
                color: #666;

                &:focus {
                  outline: none;
                  border-color: #1b94fb;
                }

                &::placeholder {
                  color: #c9c9c9;
                }
              }
            }
          }

          &:last-child {
            border-right: none;
          }
        }

        th {
          .cell {
            background: #ededed;
            justify-content: center;
          }
        }

        td:first-child {
          .cell {
            justify-content: center;
          }
        }

        td:nth-child(2) {
          .cell {
            justify-content: center;
          }
        }

        th {
          .cell {
            background: #ededed;
            justify-content: center;
          }
        }

        .cell {
          .is-checked {
            .el-checkbox__inner {
              color: #1b93f9;
              background-color: #1b93f9;
              border-color: #1b93f9;
            }
          }

          .el-switch {
            .el-switch__input {
              font-size: 0.3rem;

              .el-switch__core {
                width: 0.48753rem;
              }
            }
          }
        }

        .el-table-column--selection .cell {
          padding: 0;
        }

        .index_p {
          width: 100%;
        }

        .index_button {
          // width: 100%;
          margin: 0 10px;
          height: 100%;
          display: flex;
          align-items: center;
          justify-content: space-between;

          i {
            font-size: 20px;

            &:first-child {
              color: #1893fc;
            }

            &:last-child {
              color: #fd5050;
            }
          }
        }

        // colgroup {
        //   width: 100% !important;
        //   display: flex;
        //   align-items: center;
        // }
        // col {
        //   flex: 1;
        // }
        // tr {
        //   width: 100%;
        //   display: flex;
        // }
        // .el-table__header {
        //   th {
        //     &:first-child {
        //       // max-width: 70px;
        //       max-width: .843803rem;
        //     }
        //     &:nth-child(2) {
        //       max-width: 70px;
        //     }
        //   }
        // }
        // .el-table__body {
        //   height: 30px;
        //   .el-table__row {
        //     td {
        //       // flex: 1;
        //       width: 100%;
        //       &:first-child {
        //         // flex: 0;
        //         // width: 500px !important;
        //         max-width: 70px;
        //         // .cell {
        //         //   order: -99;
        //         // }
        //       }
        //       &:nth-child(2) {
        //         max-width: 70px;
        //         .cell {
        //           order: -99;
        //         }
        //       }
        //       // &:last-child {
        //       //   max-width: 70px;
        //       //   .cell {
        //       //     order: 99;
        //       //   }
        //       // }
        //     }
        //   }
        //   .current-row {
        //     background: #e3f6ff;
        //   }
        // }
        .el-table__body tr:hover > td {
          background: #e3f6ff;
        }

        .el-table__footer-wrapper {
          td {
            background: #f4f4f4;
            border: none;
          }
        }

        //滚动条的宽度
        ::-webkit-scrollbar {
          width: 8px;
          height: 10px;
          background-color: #e5e5e5;
        }

        //滚动条的滑块
        ::-webkit-scrollbar-thumb {
          background-color: #c9c9c9;
        }
      }
    }

    .table_calculation {
      width: 100%;
      height: 1rem;
      box-sizing: border-box;
      padding: 0.187512rem 0;
      display: flex;
      align-items: center;
      justify-content: space-between;

      > div {
        display: flex;
        align-items: center;

        ::v-deep .el-button {
          width: 70px;
          height: 30px;
          display: flex;
          align-items: center;
          justify-content: center;
          font-size: 12px;
          color: #666;
          background: #fff;
        }

        > div {
          height: 100%;
          display: flex;
          align-items: center;
          margin-left: 20px;

          > p,
          span {
            margin: 0;
            font-size: 12px;
            color: #666;
          }

          > p {
            width: 50px;
            text-align: justify;
            text-justify: distribute-all-lines;
            /*ie6-8*/
            text-align-last: justify;
            /* ie9*/
            -moz-text-align-last: justify;
            /*ff*/
            -webkit-text-align-last: justify;
            /*chrome 20+*/
          }

          > ::v-deep .el-input {
            width: 200px;
            height: 30px;

            .el-input__inner {
              height: 100%;
              padding: 0 0.150009rem;
              font-size: 12px;
              color: #666;
            }
          }
        }
      }
    }
  }
}

.bill_mask_view_script {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 40px;
  z-index: 10;
}
</style>